html, body {
  height: 100%; /* Ensure the body takes up the full height of the viewport */
}

body {
  background-image: url("../img/Sign-in Page Background.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed; /* Keeps the image fixed on scroll */
  width: 100vw; /* Full width of the viewport */
  height: 100vh; /* Full height of the viewport */
}

@font-face {
    font-family: "FF Yoga Sans";
    src: url("../fonts/yoga.woff2") format("woff2"), /* chrome firefox */
    url("../fonts/yoga.woff") format("woff"), /* chrome firefox */
    url("../fonts/yoga.ttf") format("truetype"); /* chrome firefox opera Safari, Android, iOS 4.2+*/
}

input[type=text],
input[type=password] {
    height: auto;
    border: 1px solid #333;
    padding: 8px 13px;
    border-radius: 5px;
    outline: none;
    font-size: 16px;
    width: 100% !important;
    font-family: 'FF Yoga Sans';
}

input[type=text]:focus,
input[type=password]:focus,
input[type=text]:hover,
input[type=password]:hover,
input[type=text]:active,
input[type=password]:active {
    outline: none !important;
    box-shadow: none !important;
    border: 1px solid #333;
}

.pf-c-form__label-text {
  font-family: 'FF Yoga Sans';
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 22px;
  color: rgba(15, 50, 70, 0.65);
}

.pf-c-alert__title {
  grid-area: title;
  font-weight: 500;
  word-break: break-word;
  }
  

.card-pf {
  background: #FFFFFF;
  border-radius: 5px;
  border-top: none;
  font-family: 'FF Yoga Sans';
  color: #0F3246;
}

.sign-in-subtext {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  text-align: center;
  width: 372px;
  display: inline-block;
}

.subtext-container {
  width: 420px;
}

h1#kc-page-title {
  font-style: normal;
  font-weight: 500;
  font-size: 34px;
  line-height: 150%;

  text-align: center;
  font-feature-settings: 'pnum' on, 'lnum' on;
}

input#kc-login {
    text-shadow: none;
    margin: 10px 0 20px;
    padding: 11px 35px;
    background: #FFE47F;
    outline: none;
    color: #0F3246;
    border-radius: 3px;
    font-family: 'FF Yoga Sans';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
}

#kc-header-wrapper img {
    width: 394px;
    height: auto;
    src: url("../img/Activated Insights_Light.svg"); 
}